<template>
  <section class="editBigAreaInfo">
    <el-dialog
      v-dialogDrag
      :close-on-click-modal="false"
      :append-to-body="true"
      :visible.sync="detailsVisible"
      width="70%"
      @open="open"
      @close="closeEdit"
    >
      <dialogHeader
        slot="title"
        title="详情"
        :style-type="$store.state.app.dialogType"
      />
        <div class="filter-container filter-params">
          <el-row>
            <one-table-template
              ref="multipleTable"
              :key="oneTableKey"
              :dynamic-api-config="apiConfig"
              :dynamic-table-cols="tableCols"
              :dynamic-form-fields="formField"
              :dynamic-is-show-select="false"
              :dynamic-is-init-table="true"
            />
          </el-row>
        </div>
    </el-dialog>
  </section>
</template>

<script>
import { oneTableWithViewTemplateMixins } from '@/components/mixins/oneTableWithViewTemplateMixins'
import OneTableTemplate from '@/components/templates/oneTable'
import { orgApis } from '@/api/pa/salesManagementOfSparePartsInOutlets'

export default {
    components: {
        OneTableTemplate,
        dialogHeader: () => import('@/components/dialogHeader')
    },
    // 组件混入对象
    mixins: [oneTableWithViewTemplateMixins],
    props:{
      dynamicEditRowData: {
        type: Object,
        default: function(){
          return {}
        }
      }
    },
    data(){        
      // 页面标识（与上面beforeRouteEnter中的对应）
      const viewPageCode = this.$route.path
      // 绑定事件配置化事件
      this.$ConfigCache.CacheConfig.bindEvent(this, [viewPageCode])
      return{
        detailsVisible:false,
        // 网格查询API配置对象
        apiConfig: orgApis.salesOrderQueryquery,
        // 动态生成网格列
        tableCols:
            this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
            this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols &&
            this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
            .length > 0
            ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
            : [
                {
                prop: 'saleOrderId',
                label: '主键ID',
                hidden: true,
                alwaysHidden: true
                },
                {
                prop: 'saleOrderDId',
                label: '主键ID',
                hidden: true,
                alwaysHidden: true
                },
                {
                prop: 'updateControlId',
                label: '并发控制ID',
                hidden: true,
                alwaysHidden: true
                },
                {
                prop: 'saleOrderCode',
                label: '销售单号',
                hidden: false,
                width: 140
                },
                {
                prop: 'customerTypeCn',
                label: '客户性质',
                hidden: false
                },
                {
                prop: 'saleTypeCn',
                label: '销售类型'
                },
                {
                prop: 'customerName',
                label: '客户名称'
                },
                {
                prop: 'customerPhone',
                label: '联系电话',
                width: 140
                },
                {
                prop: 'partNo',
                label: '备件编号'
                },
                {
                prop: 'partName',
                label: '备件名称'
                },
                {
                prop: 'salePrice',
                label: '销售价格'
                },
                {
                prop: 'saleQty',
                label: '销售数量'
                },
                {
                prop: 'saleAmount',
                label: '销售金额'
                },
                {
                prop: 'outboundQty',
                label: '已出库数量'
                },
                {
                prop: 'returnQty',
                label: '退货数量'
                },
                {
                prop: 'saleStatusCn',
                label: '销售状态'
                },
                {
                prop: 'empName',
                label: '制单人'
                },
                {
                prop: 'createdDate',
                label: '制单时间',
                width: 140
                }
            ],
        // 动态组件-查询条件
        tableComponents:
            this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
            this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
            .tableComponents &&
            this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
            .tableComponents.length > 0
            ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
                .tableComponents
            : [
                {
                compKey: 'compKey1',
                labelName: '网点编码：',
                codeField: 'dlrCode',
                component: () => import('@/components/pa/dlrCode'),
                disabled: false,
                isMul: false,
                isMust: true
                },
                {
                compKey: 'compKey2',
                labelName: '网点名称：',
                codeField: 'dlrShortName',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                disabled: true,
                isMul: false,
                isMust: true
                },
                {
                compKey: 'compKey3',
                labelName: '销售单号：',
                codeField: 'saleOrderDCode',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMul: false,
                isMust: true
                },

                {
                compKey: 'compKey4',
                labelName: '客户性质：',
                codeField: 'customerType',
                component: () => import('@/components/org/LookupValue'),
                oFields: 'customerType,statusText',
                options: [
                    { customerType: '0', statusText: '一般客户' },
                    { customerType: '1', statusText: '直营店' },
                    { customerType: '2', statusText: '授权店' }
                ],
                type: 'dropdownList',
                isMul: false,
                isMust: true
                },
                {
                compKey: 'compKey5',
                labelName: '客户名称：',
                codeField: 'customerName',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMul: false,
                isMust: false
                },
                {
                compKey: 'compKey6',
                labelName: '联系电话：',
                codeField: 'customerPhone',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMul: false,
                isMust: false
                },

                {
                compKey: 'compKey7',
                labelName: '销售状态：',
                codeField: 'saleStatus',
                component: () => import('@/components/org/LookupValue'),
                oFields: 'statusId,statusText',
                options: [
                    { statusId: '1', statusText: '已提交' },
                    { statusId: '2', statusText: '已收款' },
                    { statusId: '3', statusText: '部分出库' },
                    { statusId: '4', statusText: '全部出库' }
                ],
                type: 'dropdownList',
                isMul: false,
                isMust: false
                },
                {
                compKey: 'compKey8',
                labelName: '制单日期：',
                codeField: 'startDate,endDate',
                component: () => import('@/components/org/datePicker/datePicker'),
                dateType: 'daterange',
                // format: 'yyyy-MM-dd',
                isMul: false,
                isMust: false
                },
                {
                compKey: 'compKey9',
                labelName: '制单人：',
                codeField: 'dlrMakerId',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMul: false,
                isMust: false
                },

                {
                compKey: 'compKey10',
                labelName: '备件编码：',
                codeField: 'partNo',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMul: false,
                isMust: false
                },

                {
                compKey: 'compKey11',
                labelName: '备件名称：',
                codeField: 'partName',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMul: false,
                isMust: false
                },

                {
                compKey: 'compKey12',
                labelName: '销售类型：',
                codeField: 'saleType',
                component: () => import('@/components/org/LookupValue'),
                oFields: 'statusId,statusText',
                options: [
                    { statusId: '0', statusText: '呆滞件销售' },
                    { statusId: '2', statusText: '常规销售' }
                ],
                type: 'dropdownList',
                isMul: false,
                isMust: false
                }
            ],
            tableButtons: [
                {
                compKey: 'btnKey1',
                type: 'primary',
                size: 'small',
                name: 'search',
                clickEvent: () => this.queryTable(1),
                text: this.$t('sys.button.query'), // 查询
                position: 'right',
                fuzzySearch: true
                },
                {
                compKey: 'btnKey3',
                size: 'small',
                name: 'export',
                position: 'right',
                clickEvent: () => this.exportExcel111(), // 导出
                text: '导出'
                },
                {
                compKey: 'btnKey2',
                size: 'small',
                name: 'reset',
                clickEvent: () => {
                    for (const field in this.formField) {
                    if (field === 'dlrId' || field === 'dlrCode' || field === 'dlrShortName') {
                    } else {
                        this.formField[field] = ''
                    }
                    }
                    this.tableComponents.find(o => o.codeField === 'startDate,endDate').compKey = this.$utils.generateId() + 'date' + this.$utils.generateId()
                },
                text: this.$t('sys.button.reset'),
                position: 'right' // 重置
                }
            ],
            formField:{
                saleOrderCode:null
            }
        }
    },
    methods: {
      open(){
        this.formField.saleOrderCode = this.dynamicEditRowData.saleOrderCode
        this.$refs.multipleTable.queryTable()
      },
      closeEdit(){
        this.formField.saleOrderCode = ""
      }
    }
    
}
</script>

<style>

</style>